<!--
 * @Author: wjk
 * @Date: 2019-12-31 15:53:26
 * @LastEditors: wjk
 * @LastEditTime: 2020-12-25 16:16:15
 * @description: file content
 -->
<template>
  <base-page-view class-name="login-container">
    <b-image class="close" src="/static/images/icon/icon_close.png" width="38" height="38" @click="toHome" @longpress="showEnvSelect"></b-image>
    <b-image class="logo" src="/static/images/login/login_logo_new.png" is-asset width="255" height="228"></b-image>
    <b-image class="bg_man" src="/static/images/login/login_bg_new.png" is-asset width="750" height="715"></b-image>
    <view class="login-control">
      <view class="wechat-button mobile-button" @click="toMobileLogin">
        <b-image width="28" height="37" src="/static/images/login/icon_login_mobile.png" is-asset mode="aspectFit"></b-image>
        <view class="text">
          手机登录
        </view>
      </view>
      <!-- #ifdef MP-WEIXIN -->
      <view class="wechat-button relative-container" @click="beforeLogin">
        <b-image width="41" height="32" src="/static/images/login/icon_login_wechat.png" is-asset mode="aspectFit"></b-image>
        <view class="text">
          微信登录
        </view>
        <b-open-type v-if="!isFirstLogin" open-type="getUserInfo" @openCallBack="wechatLogin" />
      </view>
      <!-- #endif -->
      <view v-if="false" class="loginRuleCheck">
        <image v-if="!isFirstLogin" src="/static/images/icon/icon_login_check_select.png" mode="aspectFit" @click="isFirstLogin = true"></image>
        <image v-else src="/static/images/icon/icon_login_check_default.png" mode="aspectFit" @click="isFirstLogin = false"></image>
        我已阅读并同意
        <text class="text" @click="goRule('userAgreement')">《用户注册协议》</text>
        和
        <text class="text" @click="goRule('userPrivacy')">《碧选会员隐私政策》</text>
      </view>
    </view>
    <confirmPopup ref="confirm">
      <view slot="content" class="login-right-popu">
        <view>欢迎使用“碧选”！我们非常重视每一个用户的个人信息安全及隐私保护。在您使用“碧选”服务之前，请仔细阅读：</view>
        <view>
          碧选
          <text @click="goRule('userAgreement')">《用户协议》</text>、
          <text @click="goRule('userPrivacy')">《隐私协议》</text>
          和
          <text @click="goRule('sharing_economy_agreement')">《共享经济合作伙伴协议》</text>
        </view>
        <view>依据最新法律要求，我们将严格按照您同意的各项条款使用您的个人信息，以便为您提供更好的服务。</view>
        <view>如您同意此政策，请点击“同意”并开始使用我们的产品和服务。</view>
        <view>我们将竭尽全力保证您的信息安全！</view>
      </view>
    </confirmPopup>
  </base-page-view>
</template>

<script>
import { mapState } from 'vuex'
import confirmPopup from '@/components/confirmPopup/index'
// import { toMpHomePage } from '@/utils/navigateTo'
import './index.scss'
export default {
  components: {
    confirmPopup
  },
  data() {
    return {
      isFirstLogin: false
    }
  },
  computed: {
    ...mapState(['token'])
  },
  onLoad() {
    // 缓存为1的时候，不是第一次登陆
    var _isNotFirstLogin_ = uni.getStorageSync('_isNotFirstLogin_')
    if (!_isNotFirstLogin_) {
      this.isFirstLogin = true
    } else {
      this.isFirstLogin = false
    }
  },
  onShow() {
    if (this.token) {
      this.$navigateTo('/pages/home/index', {}, 'reLaunch')
    }
  },
  methods: {
    async wechatLogin(e) {},
    // 切换环境代码
    showEnvSelect() {
      if (process.env.VUE_APP_BUILD_TYPE === 'PROD') {
        return
      }
      const envNode = uni.getStorageSync('envNode') || 'UAT'
      const envName = {
        TEST: '测试',
        UAT: 'UAT',
        PROD: '正式'
      }
      uni.showModal({
        title: '提示',
        content: `当前是${envName[envNode]}环境，切到其它环境？`,
        success: res => {
          if (res.confirm) {
            uni.showActionSheet({
              itemList: ['测试环境', 'UAT环境', '正式环境'],
              success: res => {
                this.$store.dispatch('LOGOUT_USER')
                const env = ['TEST', 'UAT', 'PROD'][res.tapIndex]
                uni.setStorage({
                  key: 'envNode',
                  data: env
                })
                uni.showToast({
                  title: `已切换到${envName[env]}环境`,
                  icon: 'none'
                })
                setTimeout(() => {
                  this.$navigateTo(`/pages/home/index`, {}, 'reLaunch')
                }, 1500)
              }
            })
          }
        }
      })
    },
    toMobileLogin() {
      if (this.isFirstLogin) {
        this.showConfirm(1)
      } else {
        this.$navigateTo('/pages/login/mobile', {}, 'redirectTo')
      }
    },
    // 点击微信登陆
    beforeLogin() {
      if (this.isFirstLogin) {
        this.showConfirm(2)
      }
    },
    showConfirm(type) {
      const content = {
        title: '碧选隐私政策',
        titleStyle: 'font-weight:bold;padding-top:60rpx;',
        content: '',
        containerStyle: 'flex-direction: column-reverse; width: 452rpx;margin: 0 auto;',
        cancleTxtStyle: 'border: 2rpx solid #ddd; margin: 30rpx 0; color: #999',
        yesTxtStyle: 'color: white;background-color: #000;border: 2rpx solid #000;',
        cancleTxt: '不同意',
        yesTxt: '我同意',
        maskClickClose: false,
        yesCb: () => {
          uni.setStorageSync('_isNotFirstLogin_', 1)
          this.isFirstLogin = false
          if (type === 1) {
            // 手机号登陆
            this.$navigateTo('/pages/login/mobile', {}, 'redirectTo')
          } else if (type === 2) {
            // 微信登陆
          }
        }
      }
      // if (type === 1) {
      // uni.showToast({
      //   title: `请先阅读并同意协议`,
      //   icon: 'none'
      // })
      // }
      if (type === 2) {
        content.authBtn = true
        content.openType = 'getUserInfo'
        content.yesTxt = ''
        content.authBtnTxt = '我同意'
        content.openCallBack = () => {
          this.wechatLogin()
        }
      }
      this.$refs.confirm.show(content)
    },
    goRule(type) {
      this.$navigateTo('/pagesMine/rule/index?type=' + type)
    },
    toHome() {
      // toMpHomePage()
      uni.removeStorage({ key: 'pageAfterLogin' })
      uni.navigateBack()
    }
  }
}
</script>
